<html>

<head>
	<title>会飞的猪</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
	<!-- 定制版 ionic 样式 -->
	<link rel="stylesheet" href="../css/editormd.css" />
	<link rel="stylesheet" href="../css/vonic.min.css">
	<script src="../js/jquery.min.js"></script>
	<script src="../lib/jquery.cookie.js"></script>
	<script src="../lib/c.js"></script>
	<script src="../js/a.js"></script>
	<script src="../js/crypto-js.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/leancloud-storage@3.14.1/dist/av-live-query-min.js"></script>
	<script src="js/net.js"></script>
	<script src="js/patch.js"></script>
	<script src="../lib/vue-marked.js" type="text/javascript"></script>
	<!-- 依赖库 axios/vue/vue-router -->
	<script src="../js/vue-router.js"></script>
	<script src="../js/axios.js"></script>
	<script src="../js/vue.js"></script>
	<script src="../js/vuex.js"></script>
	<script src="../js/vonic.min.js"></script>
	<script src="../lib/marked.min.js"></script>
	<script src="../lib/prettify.min.js"></script>
	<script src="../editormd.js"></script>
	<script src="../lib/raphael.min.js"></script>
   
    <script src="../lib/flowchart.min.js"></script>
    <script src="../lib/jquery.flowchart.min.js"></script>
    <script src="../lib/sequence-diagram.min.js"></script>

</head>

<body>
	<!-- mount point -->
	<von-app></von-app>
	<!-- templates -->
	<script type="x-template" id="index">

			<div class="page">
        <div class="page-content text-center">
		<div class="centerV login">
			<div>
				
			
          <h2 class="padding">{{msg}}</h2>
          <von-input 
          type="text" 
		   v-model="bean.name" 
          placeholder="用户名/手机/邮箱" 
          label="用户名">
        </von-input>
		<div class="space">		
		</div>
        <von-input 
        type="password" 
        placeholder="密码" 
		  v-model="bean.pwd" 
        label="密码">
      </von-input>
	  <div class="space">
	  </div>
      <md-button class="button button-assertive button-block "@click.native="loginAction()">
            登录
          </md-button>
   </div>
          </div>
        </div>
      </div>
    </script>
	<script type="x-template" id="mdViewer">
			<div class="page">
			
				<von-header theme="assertive">
					<button  class="button button-icon ion-ios-arrow-back" slot="left" @click="back()"></button>
				  <span slot="title">{{mdName}}</span>
				  <div  slot="right">
						<button class="button button-icon ion-android-share"  @click="openShare()"></button>
						<button class="button button-icon ion-navicon"  @click="openMenu()"></button>
				  </div>
				</von-header>
				<div class="page-content">
					<scroll style="margin-top:3.3rem" :on-refresh="onRefresh">
							<div id="overMd" style="padding:10px">
								<div id="mdOverBg"></div>
							</div>
					</scroll>
					<md-button @click.native="scrolUp()" style="position:absolute;bottom:5rem;right:1rem;z-index99" class="button button-assertive button-fab">
							<i class="icon ion-android-arrow-up"></i>
						  </md-button>
			</div>
				
			  </div>
	</script>
	<script type="x-template" id="shareMd">
		<div class="page">
		
			<von-header theme="assertive">
					<button  class="button button-icon ion-ios-arrow-back" slot="left" @click="back()"></button>
			  <span slot="title">{{mdName}}</span>
			  <button class="button button-icon ion-navicon" slot="right"  @click="openMenu()"></button>
			</von-header>
			<div class="page-content">
					<scroll style="margin-top:3.3rem" :on-refresh="onRefresh">
							<div id="overMd" style="padding:10px">
								<div id="mdOverBg"></div>
							</div>
					</scroll>
					<md-button  @click.native="scrolUp()" style="position:absolute;bottom:5rem;right:1rem;z-index99" class="button button-assertive button-fab">
							<i class="icon ion-android-arrow-up"></i>
						  </md-button>
			</div>
			
			
		  </div>
</script>
	<script type="x-template" id="pwd">

			<div class="page">
				<von-header theme="assertive">
					<button class="button button-icon ion-ios-arrow-back" slot="left" @click="back()"></button>
				  <span slot="title">修改密码</span>
				</von-header>
				
				  <div class="page-content text-center">
							<div style="position:absolute;top:0;width:100%;margin-top:5rem">
				  <von-input 
				  type="password" 
				  placeholder="密码" 
						  v-model="bean.pwd" 
				  label="旧密码">
				</von-input>
				<div class="space">
				</div>
				<von-input
				  type="password" 
				  placeholder="密码" 
						  v-model="bean.pwd" 
				  label="新密码">
				</von-input>
					
						<div class="space">		
						</div>
				<md-button class="button button-assertive button-block "@click.native="loginAction()">
				      保存
				    </md-button>
					</div>
			
			  </div>
			  </div>
	</script>
	<script type="x-template" id="main">
			<div class="page" v-tabbar="{'menus': menus, menuColor: '#B5B5B5', activeMenuColor: '#EA5A49', onMenuClick: menuClicked}">
                    <router-view></router-view>
                  </div>
    </script>
	<script type="x-template" id="home">
			<div class="page has-navbar has-tabbar" v-tabbar-menu-index="0">
              <von-header theme="assertive">
                <span slot="title">首页</span>
			  </von-header>
			  <div class="page-content page-swiper">
			  <swiper  ref="swiper" direction="horizontal" width="100%" height="150" pager-color="#ea5a49" pager-bg-color="#e5e4e3" style="text-align:center; margin-top:0.5rem">
					
					<swiper-item v-for="(item, index) in urls" :key="index" style="background-color:white">
					  <img :src="item" width="100%" height="100%"/>
					</swiper-item>
		
					<!-- <swiper-item  style="background-color:white">
					  <h1 style="color: #44cc00;">Item 2</h1>
					</swiper-item>
		
					<swiper-item  style="background-color:white">
					  <h1 style="color: #ffc900;">Item 3</h1>
					</swiper-item> -->
				  </swiper>
				  <div class="page-cells">
					  <cells :items="entrances" :on-cell-click="onCellClick" row="2"></cells>
					  <div>	  
				  </div>
				  
			</div>
		</div>
          </script>



	<script type="x-template" id="md">
			<div class="page has-navbar has-tabbar" v-tabbar-menu-index="1">
                  <von-header theme="assertive">
                    <span slot="title">我的文章</span>
				  </von-header>
				
				
                  <scroll class="page-content"
                          :on-refresh="onRefresh"
						  :on-infinite="onInfinite">
						  <search v-model="keywords" placeholder="输入文章名称" :on-search="onSearch"></search>
                    <item v-for="(item, index) in items" :key="index" @click.native="onItemClick(index)" :class="{'item-stable': index % 2 == 0}">
                      {{ item.name }}
                    </item>
                        
                    <div v-if="noMore" slot="infinite" class="text-center">没有更多数据</div> 
				  </scroll>
				</div>
                
			  </script>
	<script type="x-template" id="groupMd">
			<div class="page">
			
			
				
                  <scroll class="page-content"
                          :on-refresh="onRefresh"
						  :on-infinite="onInfinite">
						  <search v-model="keywords" placeholder="输入文章名称" :on-search="onSearch"></search>
                    <item v-for="(item, index) in items" :key="index" @click.native="onItemClick(index)" :class="{'item-stable': index % 2 == 0}">
                      {{ item.name }}
                    </item>
                        
                    <div v-if="noMore" slot="infinite" class="text-center">没有更多数据</div> 
				  </scroll>
				</div>
                
			  </script>
	<script type="x-template" id="groupTabs">
				<div class="page">
					<von-header theme="assertive">
						<button class="button button-icon ion-ios-arrow-back" slot="left" @click="back()"></button>
					  <span slot="title">{{groupName}}</span>
					</von-header>
					<tabs  theme="assertive" :tab-items="tabs" :tab-index="tabIndex" :on-tab-click="onTabClick">
					</tabs>
							<router-view style="margin-top:3.3rem"></router-view>
				</div>
				  </script>
	<script type="x-template" id="groupNumber">
				<div class="page">
					
					  <scroll 
					          class="page-content"
							  :on-refresh="onRefresh"
							  :on-infinite="onInfinite">
							  <search v-model="keywords" placeholder="输入成员名称" :on-search="onSearch"></search>
						<item v-for="(item, index) in items" :key="index" @click.native="onItemClick(index)" :class="{'item-stable': index % 2 == 0}">
						  {{ item.numberName }}
						</item>
							
						<div v-if="noMore" slot="infinite" class="text-center">没有更多数据</div> 
					  </scroll>
					</div>
					
				  </script>
	<script type="x-template" id="group">
			<div class="page has-navbar has-tabbar" v-tabbar-menu-index="2">
                  <von-header theme="assertive">
                    <span slot="title">我的群组</span>
				  </von-header>
				
				
                  <scroll class="page-content"
                  :on-refresh="onRefresh"
				  :on-infinite="onInfinite">
				  <search v-model="keywords" placeholder="输入群组名称" :on-search="onSearch"></search>
            <item v-for="(item, index) in items" :key="index" @click.native="onItemClick(index)" :class="{'item-stable': index % 2 == 0}">
              {{ item.groupName }}
            </item>
      
            <div v-if="noMore" slot="infinite" class="text-center">没有更多数据</div>
		  </scroll>
		
                </div>
              </script>
	<script type="x-template" id="user">
			<div class="page has-navbar has-tabbar" v-tabbar-menu-index="3">
                  <von-header theme="assertive">
                    <span slot="title">关于</span>
                  </von-header>
				  <div class="page-content" style="padding-top: 54px;">
						<div class="item item-divider">
						 管理
						</div>
			  
						
						<item class="item-icon-left">
								{{bean.name}}
						  <i class="icon ion-social-github dark"></i>
						</item>
					
						<item class="item-icon-right">
						  成员等级
						  <span class="item-note">{{showNumberPowerName(bean.power)}}</span>
						  <i class="icon ion-ios-arrow-right" style="color: #DDD;"></i>
						</item>
			  <item class="item-icon-right" @click.native="changePwd()">
			    修改密码
			    <span class="item-note"></span>
			    <i class="icon ion-ios-arrow-right" style="color: #DDD;"></i>
			  </item>
			  <von-toggle theme="assertive" text="是否推送新文章" v-model="push"></von-toggle>
			  <von-toggle theme="assertive" text="是否自动检查更新" v-model="updata"></von-toggle>
			  <von-toggle theme="assertive" text="是否缓存用户名密码" v-model="updataUser"></von-toggle>
			  <von-toggle theme="assertive" text="自动同步服务器数据" v-model="fitToc"></von-toggle>
			  <von-toggle theme="assertive" text="文章目录适配" v-model="saveUser"></von-toggle>
			  
						<div class="item item-divider">
						  关于作者
						</div>
			  
						<list class="list-ios">
							<item class="item-icon-right">
							  当前版本
							  <span class="item-note">1.0</span>
							  <i class="icon ion-ios-arrow-right" style="color: #DDD;"></i>
							</item>
						  <item class="item-icon-right">
						    作者
							<a class="item-note" target="view_window" style=" text-decoration:none" href="https://zyqing.ml">会飞的猪</a>
						    <i class="icon ion-ios-arrow-right" style="color: #DDD;"></i>
						  </item>
						 
						  <item>
							帮助我做的更好
						  </item>
						</list>
			  
						<md-button class="button button-assertive button-block "@click.native="loginOut()">
								退出登录
							  </md-button>
			  
						<div style="height: 100px"></div>
					  </div>
                </div>
            </script>
	<script>
		$.MdManager.initJS()
		$.Encryption.user.init()
		function juageLogin(flag) {
			if (!($.Encryption.user.isLogin())) {
				if(flag){
					$dialog.alert({
					// 效果
					effect: 'default',
					// 标题
					title: '提示',
					// 内容
					content: '您没有登录',
					// 按钮文本
					okText: '确定',
					// 按钮主题
					okTheme: 'assertive'
				})
				}	
				return false
			}
			return true
		}
		// Page Components
		patchPage.loadJS('./page/index.js')
		patchPage.loadJS('./page/main.js')
		patchPage.loadJS('./page/home.js')
		patchPage.loadJS('./page/user.js')
		patchPage.loadJS('./page/group.js')
		patchPage.loadJS('./page/mdViewer.js')
		patchPage.loadJS('./page/groupMd.js')
		patchPage.loadJS('./page/groupNumber.js')
		patchPage.loadJS('./page/mdView.js')
		patchPage.loadJS('./page/pwd.js')
		patchPage.loadJS('./page/groupTabs.js')
		patchPage.loadJS('./page/shareMd.js')

		patchPage.loadReady(function () {
			var routes = [{
				path: '/',
				component: Index
			},
			{
				path: '/main/mdViewer',
				component: mdViewer
			},
			{
				path: '/shareMd',
				component: shareMd
			},
			{
				path: '/main/pwd',
				component: Pwd
			},

			{
				path: '/main/groupTabs',
				component: groupTabs,
				name: 'groupTabs',
				children: [
					{
						path: 'groupMd',
						component: groupMd,
						name: 'groupMd'
					},
					{
						path: 'groupNumber',
						component: groupNumber,
						name: 'groupNumber'
					},
				]
			},

			{
				path: '/main',
				component: Main,
				children: [{
					path: 'home',
					component: Home
				},
				{
					path: 'md',
					component: MdView
				},

				{
					path: 'group',
					component: Group
				},
				{
					path: 'user',
					component: User
				}
				]
			}
			]
			Vonic.app.setConfig(
				'beforeEach', function (to, from, next) {
					if (to.path === '/' || to.path.contain('shareMd')) {
						if(to.path === '/' &&juageLogin(false)){
							next({ path: '/main/home' })
						}else{
							next()
						}
					} else if (to.path.contain('toc')) {
						if (from.path === '/') {
							next({ path: '/main/home' })
						} else {
							return false
						}
					} else if (juageLogin(true)) {
						next()
					} else {
						next({ path: '/' })
					}

				}
			)

			Vue.use(Vonic.app, {
				routes: routes
			})

		})



	</script>
</body>
<style>
	.centerV {
		position: absolute;
		top: 0;
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		flex-direction: column;
	}

	/* a {
        position: relative;
        pointer-events: auto;
        z-index: 9;
    } */
	.login {
		padding: 1.5rem;
	}

	#overMd {
		position: relative;
		background-color: white
	}

	.space {
		width: 100%;
		height: 1rem;
	}

	.entrance {
		height: 10rem;
	}

	#mdOverBg {
		position: absolute;
		height: 100%;
		width: 95%;
		/* display: none; */
		top: 0;
		z-index: 9;
	}

	#overMd {
		position: relative;
	}

	.tocStyle {
		position: relative;
		pointer-events: auto;
		z-index: 10;
	}
    .home-img{
		background: url('xxx') center center no-repeat;
		background-size: 100%;
	}
	.item-input-inset {
		margin-top: 0.5rem;
	}
	.page-cells{
		font-size: 1rem
	}
	.entrance{
	 height: auto;
	 padding: 2rem	
	}
</style>


</html>